<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://pinzafile.oss-cn-shanghai.aliyuncs.com/vue-element/loading.js"></script>
    <link rel="stylesheet" type="text/css" href="/libs/bootstrap/css/bootstrap.min.css">
    <link href="https://pinzafile.oss-cn-shanghai.aliyuncs.com/publiccss/assets/global/plugins/layui/css/layui.css"
          rel="stylesheet" type="text/css"/>

    <link rel="stylesheet" type="text/css"
          href="https://pinzafile.oss-cn-shanghai.aliyuncs.com/admin/product/libs/font-awesome/css/font-awesome.min.css">
    <link rel=stylesheet href="/css/style.css" type="text/css">
    <link href="/css/style-shop.css" rel="stylesheet" type="text/css">
    <link href="https://pinzafile.oss-cn-shanghai.aliyuncs.com/publiccss/assets/admin/layout/css/layout.css"
          rel="stylesheet" type="text/css"/>
    <link href="https://pinzafile.oss-cn-shanghai.aliyuncs.com/publiccss/assets/global/plugins/layui/css/layui.css"
          rel="stylesheet" type="text/css"/>

</head>
<div class="page-header">
    <div class="page-header-top">
        <div class="container">
            <!-- LOGO -->
            <div class="page-logo">
                <a href="/">
                    <img src="https://pinzafile.oss-cn-shanghai.aliyuncs.com/publiccss/productDesk/image/logo.png"
                         alt="logo" class="pinza-logo">
                </a>
            </div>
            <!--菜单-->
            <div class="top-menu">
                <ul class="nav pull-right">
                    <!--个人中心-->
                    <li class="dropdown dropdown-extended dropdown-dark dropdown-inbox" id="header_inbox_bar">
                        欢迎您：${userName}
                    </li>
                    <li class="dropdown dropdown-extended dropdown-dark dropdown-inbox" id="header_inbox_bar">
                        <a href="http://pinzabim.oss-cn-shanghai.aliyuncs.com/Optional/home.html"
                           target="_blank">选装体验</a>
                    </li>
                    <li class="dropdown dropdown-user dropdown-dark">
                        <a href="/index.page" target="_blank">
                            <span class="username username-hide-mobile">客户中心</span>
                        </a>
                    </li>
                    <li class="dropdown dropdown-user dropdown-dark">
                        <a href="/shopping/shopcar.page">
                            <span class="username username-hide-mobile">返回购物车</span>
                        </a>
                    </li>
                    <li class="dropdown dropdown-user dropdown-dark">
                        <a href="/logout">
                            <span class="username username-hide-mobile">退出</span>
                        </a>
                    </li>
                </ul>
            </div>

            <div class="clearfix"></div>
        </div>
    </div>

</div>
<div class="container">
    <div class="row">
        <ul class="breadcrumb">
            <li><a href="/">首页</a></li>
            <li class="active">选装列表</li>
        </ul>
    </div>
</div>

<div class="container" style="background: white">

    <div class="layui-card">
        <div class="layui-card-header">填写订单信息</div>
        <div class="layui-card-body" style="padding: 15px;">
            <form id="addressform" class="form-horizontal form-row-seperated" lay-filter="component-form-group">
                <div class="form-group">
                    <span class="control-label col-md-2">订单总额</span>
                    <div class="col-md-4">
                        <input type="text" name="price" lay-verify="title" value="${price}" autocomplete="off" readonly
                               class="layui-input">
                    </div>
                </div>
            <#--<div class="form-group">-->
            <#--<span class="control-label col-md-2">订单名称</span>-->
            <#--<div class="col-md-4">-->
                <input type="text" hidden="hidden" name="order_name" value="默认订单名称">
            <#--<input type="text" hidden="hidden" name="user_id" value="${user_id!''}">-->
            <#--<input type="text" hidden="hidden" name="project_name" value="项目名称默认为公司名称">-->

            <#--</div>-->
            <#--</div>-->
                <div class="form-group">
                    <span class="control-label col-md-2">供应商联系人</span>
                    <div class="col-md-4">
                        <select class="layui-input" name="buyer" lay-verify="required" lay-search=""
                                id="groupList">
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <span class="control-label col-md-2">项目名称</span>
                    <div class="col-md-4">
                        <select class="layui-input" name="project_name" lay-verify="required" lay-search=""
                                id="projectList">
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <span class="control-label col-md-2">客户联系人</span>
                    <div class="col-md-4">
                        <select class="layui-input" name="user_id" lay-verify="required" lay-search="" id="userList">
                        </select>
                    </div>
                </div>

            <#--<div class="layui-form-item">-->
            <#--<div class="layui-inline">-->
            <#--<label class="control-label col-md-2"></label>-->
            <#--<div class="col-md-4">-->

            <#--</div>-->
            <#--</div>-->
            <#--</div>-->
            <#--<div class="form-group">-->
            <#--<span class="control-label col-md-2">项目名称</span>-->
            <#--<div class="col-md-4">-->
            <#--<input type="text" name="project_name" lay-verify="identity" placeholder="" autocomplete="off" class="layui-input">-->
            <#--</div>-->
            <#--</div>-->
            <#--<div class="form-group">-->
            <#--<span class="control-label col-md-2"></span>-->
            <#--<div class="col-md-4">-->
            <#--<input type="text" name="consignee_name" lay-verify="identity" placeholder="" autocomplete="off" class="layui-input">-->
            <#--</div>-->
            <#--</div>-->
                <div class="form-group">
                    <span class="control-label col-md-2">收货人</span>
                    <div class="col-md-4">
                        <select class="layui-input" name="consignee_information" lay-verify="required" lay-search=""
                                id="userList1">
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <span class="control-label col-md-2">收货地址及联系方式</span>
                    <div class="col-md-4">
                        <input type="text" name="consignee_address" lay-verify="identity" placeholder=""
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
            <#--<div class="layui-form-item">-->
            <#--<label class="layui-form-label">要求到货时间</label>-->
            <#--<div class="layui-input-block">-->
            <#--<input type="text" name="arriveTime" class="layui-input" id="test5" placeholder="yyyy-MM-dd HH:mm:ss">-->
            <#--&lt;#&ndash;<input type="text" name="consignee_address" lay-verify="identity" placeholder="" autocomplete="off" class="layui-input">&ndash;&gt;-->
            <#--</div>-->
            <#--</div>-->
                <div class="form-group">
                    <span class="control-label col-md-2">备注</span>
                    <div class="col-md-4">
                        <textarea name="remark" placeholder="请输入内容" class="layui-textarea"></textarea>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <div class="form-actions">
        <div class="row">
            <div class="col-md-offset-3 col-md-9">
                <button class="btn btn-primary bt-print-submit" id="submit" type="button">提交订单</button>

            </div>
        </div>
    </div>

</div>


</body>
</html>
<script type=text/javascript src="/js/jquery-2.0.3.min.js"></script>
<script src="https://pinzafile.oss-cn-shanghai.aliyuncs.com/publiccss/assets/global/plugins/layui/layui.js"
        type="text/javascript"></script>

<!--滚动条脚本-->
<script src="/js/jquery.nicescroll.js"></script>
<script>
    var company_id = "${company_id!''}";
    var group_id = "${group_id!''}";
    //获取项目列表
    $.ajax({
        url: '/project/projectList.json?company_id=' + company_id,
        type: 'get',
        dataType: 'json',
        success: function (result) {
            var temp_html = "";
            if (result.ret) {
                var data = result.data.list;
                for (var o in data) {
                    temp_html += "<option value='" + data[o].project_name + "'>" + data[o].project_name + "</option>";
                }
            }
            $("#projectList").html(temp_html);
        }
    });
    //获取客户联系人列表
    $.ajax({
        url: '/user/getUserListByCompanyId.json?companyId=' + company_id,
        type: 'get',
        dataType: 'json',
        success: function (result) {
            var temp_html = "";
            var html = "";
            if (result.ret) {
                var data = result.data;
                for (var o in data) {
                    temp_html += "<option value='" + data[o].id + "'>" + data[o].user_name + "</option>";
                    html += "<option value='" + data[o].user_name + "'>" + data[o].user_name + "</option>";
                }
            }
            $("#userList").html(temp_html);
            $("#userList1").html(html);
        }
    });
    //获取供应商联系人列表
    $.ajax({
        url: '/user/getUserListByGroupId.json?groupId='+group_id,
        type: 'get',
        dataType: 'json',
        success: function (result) {
            var temp_html = "";
            if (result.ret) {
                var data = result.data;
                for (var o in data) {
                    temp_html += "<option value='" + data[o].user_name + "'>" + data[o].user_name + "</option>";
                }
            }
            $("#groupList").html(temp_html);
        }
    });
</script>
<script>
    $("body").niceScroll({
        cursorcolor: "#ccc",//#CC0071 光标颜色
        cursoropacitymax: 1, //改变不透明度非常光标处于活动状态（scrollabar“可见”状态），范围从1到0
        touchbehavior: false, //使光标拖动滚动像在台式电脑触摸设备
        cursorwidth: "5px", //像素光标的宽度
        cursorborder: "0", // 游标边框css定义
        cursorborderradius: "5px",//以像素为光标边界半径
        autohidemode: true //是否隐藏滚动条
    });

    layui.use(['layer'], function () {
        $("#submit").click(function () {
            // var boolinput = true;
            // var boolselect = true;
            // for(var i = 0;i<$("input[required=\"required\"]").length;i++){
            //     if($("input[required=\"required\"]")[i].value == ""){
            //         boolinput = false;
            //         break;
            //     }
            // }
            // for(var i = 0;i<$("select[required=\"required\"]").length;i++){
            //     if($("select[required=\"required\"]")[i].value == ""){
            //         boolselect = false;
            //         break;
            //     }
            // }
            // if(boolinput && boolselect){
            if ($("input[name='buyer']").val() === "") {
                layer.alert("供应商联系人不能为空!");
                return false;
            }
            if ($("input[name='project_name']").val() === "") {
                layer.alert("项目名称不能为空!");
                return false;
            }
            if ($("input[name='user_id']").val() === "") {
                layer.alert("客户联系人不能为空!");
                return false;
            }
            if ($("input[name='consignee_information']").val() === "") {
                layer.alert("收货人不能为空!");
                return false;
            }
            var formData = new FormData($("#addressform")[0]);
            layer.load();
            $.ajax({
                url: '/order/save.json',
                type: 'post',
                data: formData,
                dataType: 'json',
                async: true,
                cache: false,
                contentType: false,
                processData: false,
                success: function (result) {
                    console.log(result);
                    if (result.ret) {
                        layer.closeAll('loading');
                        //询问框
                        layer.confirm('添加成功是否前往订单列表页？', {
                            btn: ['是', '否'] //按钮
                        }, function () {
                            window.location.href = "/index.page";
                        }, function () {
                            layer.alert("您已取消前往", {icon: 2})
                        });
                        // window.location.reload();
                    } else {
                        layer.closeAll('loading');
                        layer.alert(result.msg, {icon: 2})
                    }
                }
            });
            // }else{
            //     layer.alert('主人，您有必选项没有填写，无法提交表单', {icon: 6});
            // }
            // $("input[required=\"required\"]")
        });
    });
</script>


<script src="/js/active.js" type="text/javascript"></script>
<script type=text/javascript src="/js/jquery-2.0.3.min.js"></script>
